/**
 * StereoEditBar
 */
 import React, { Component } from 'react';
 import classNames from 'classnames';
 import LoaderHelper from './Loaders/loaderHelper';
 import DomHelper from './domHelper';

 class StereoEditBar extends Component {

    componentDidMount(){
        this.initElements();
    }

    initElements(){
        this.elements = {
            editbar: $(this.refs.editbar)
        };
        if (DomHelper.transformType == 'translate') {
            DomHelper.currentTransformBar = $(this.elements.editbar.find('li')[0]);
        } else {
            DomHelper.currentTransformBar = $(this.elements.editbar.find('li')[1]);
        }
    }

    handleOnEditClick(type, e){
        DomHelper.transformType = type;
        DomHelper.currentTransformBar = $(e.currentTarget);
        LoaderHelper.changeTransformType(DomHelper.transformType);
    }

    render(){
        return (
            <div ref="editbar" className="stereoEditbar">
                <ul>
                    <li onClick={this.handleOnEditClick.bind(this, "translate")} className="stereoEditItem">
                        <i className="icon-move"></i>
                    </li>
                    <li onClick={this.handleOnEditClick.bind(this, "rotate")} className="stereoEditItem">
                        <i className="icon-rotate"></i>
                    </li>
                </ul>
            </div>
        )
    }
 }

 export default StereoEditBar;
